<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <!-- 导入 axios -->
    <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
</head>

<body>
    <script>
        /* 
            async/await 处理异步操作
                async/await 是 ES7 引入的新语法，可以更加方便的进行异步操作

            async
                用于声明异步函数，它以类似同步的方式来写异步方法，
                函数返回一个 Promise 对象
            
            await
               操作符用于等待一个 Promise 对象, 它只能在异步函数 async function 内部使用。

            优势：
                1. 不再通过 then() 函数处理结果。
                2. 方便多个异步操作
        */

        // 之前的 axios
        axios.defaults.baseURL = "http://127.0.0.1:8080/";

        // axios.get("axios").then(function (result) {
        //     console.log(result.data);
        // });

        // 1. 声明是异步函数
        async function queryData() {
            // 2. await 修饰 Promise 实例。(等待异步请求的结果)
            let result = await axios.get("axios");
            console.log(result);

            // 3. 不再需要通过 then 获取结果
            console.log(result.data);
            
            // 4. 返回值(修饰)是 promise
            return result.data;
        }

        queryData().then(function (data) {
            console.log(data);
        });
    </script>
</body>

</html>